/*
 * @Author: 周海 zhouhaib@yonyou.com
 * @Date: 2022-10-03 22:46:50
 * @LastEditors: Zhouhai 497675647@qq.com
 * @LastEditTime: 2024-04-30 12:13:03
 */
/* eslint-disable @typescript-eslint/no-unused-vars */
import type { Store } from 'rc-field-form/es/interface';
import React, { Ref, forwardRef } from 'react'
import { useImperativeHandle } from 'react';
import { PageHeader } from '@ant-design/pro-components';
import PageDiv from '../PageDiv';
import './index.less';
import { Divider, Form, FormInstance } from 'antd';

export type FormRef<T> = React.MutableRefObject<FormInstance<T> | undefined> | React.RefObject<FormInstance<T> | undefined>



/**
 * Props参数说明<数据类型>
 */
export interface customBillCardProps<TableDataType> {
    formid?: string;
    title?: string;
    extraButton?: JSX.Element;
    onBack?: (e?: React.MouseEvent<HTMLElement>) => void;
    /**
     * 默认值
     */
    defaultValues?: Store;

    isedit?: boolean;

    formRef?: FormInstance<TableDataType>;

    children?: JSX.Element;

    cardItem: JSX.Element;

}



const BillCard = forwardRef(<TableDataType extends Record<string, any>>(Props: customBillCardProps<TableDataType>,ref: Ref<any>) => {
    const { formid, title, onBack, extraButton, defaultValues, isedit = false, formRef: propsActionRef, children: cardBody, cardItem } = Props;


    return (
        <PageDiv style={{ backgroundColor: '#ffffff' }}>
            <PageDiv style={{ padding: '0px 15px' }}>
                <PageHeader onBack={onBack} title={title} extra={extraButton} />
                <div className='PageCard'>
                    <Form
                        key={formid}
                        labelCol={{ flex: '120px' }}
                        wrapperCol={{ flex: 1 }}
                        layout={'horizontal'}
                        disabled={!isedit}
                        form={propsActionRef}
                        initialValues={defaultValues}
                    >
                        {cardItem}
                    </Form>
                </div>
                {
                    cardBody ? <div className='PageBody'>
                        <Divider dashed />
                        {
                            cardBody
                        }
                    </div> : null
                }
            </PageDiv>
        </PageDiv>

    )
}) as <TableDataType extends object>(
    Props: customBillCardProps<TableDataType>
) => React.ReactElement;

export default BillCard;